<div class="page-header">
	<a class="pull-right btn btn-primary" ng-click="addWidget()"><i class="glyphicon glyphicon-plus"></i> Add Widget</a>
	<a class="pull-right btn btn-warning" ng-click="clear()"><i class="glyphicon glyphicon-trash"></i> Clear</a>
	<h1 style="display: inline-block; width: 200px;">Dashboard</h1>
	<select class="form-control" style="width: 150px; margin-bottom: 20px; display:inline-block;" ng-change="changeDashboard()" ng-model="selectedDashboardId" ng-options="d.id as d.name for d in dashboards | object2Array | orderBy:'id'">
	</select>

</div>
<div gridster="gridsterOptions">
	<ul>
		<li gridster-item="widget" ng-repeat="widget in dashboard.widgets">
			<div class="box" ng-controller="CustomWidgetCtrl">
				<div class="box-header">
					<h3>{{ widget.name }}</h3>
					<div class="box-header-btns pull-right">
						<a title="settings" ng-click="openSettings(widget)"><i class="glyphicon glyphicon-cog"></i></a>
						<a title="Remove widget" ng-click="remove(widget)"><i class="glyphicon glyphicon-trash"></i></a>
					</div>
				</div>
				<div class="box-content">
				</div>
			</div>
		</li>
	</ul>
</div>